<!DOCTYPE html>
<html>
	<!--何泊舟-->
	<head>
		<meta charset="UTF-8">
		<link href="file/layui-v2.4.3/layui/css/layui.css" rel="stylesheet" media="all" />
		<title>登录</title>
	</head>
	<style type="text/css">
		body {
			background: url(img/login_bg.jpg) no-repeat center center fixed;
			-webkit-background-size: cover;
			-moz-background-size: cover;
			-o-background-size: cover;
			background-size: cover; //这条一定要
		}
		
		.logink {
			background-color:rgba(0,0,0,0.5);
			border-radius:15px;
			position: absolute;
			height: 300px;
			width: 260px;
			margin-left: 41%;
			margin-top: 150px;
		}
		
		#id {
			float: left;
		}
		
		.hzsize {
			width: 80%;
			margin-left: 10%;
		}
		
		#htdl {
			width: 100%;
			font-size: 18px;
			font-weight: bold;
			color: #FFFFFF;
			margin-top: 3%;
			margin-bottom: 10%;
			margin-left: 0%;
			border-bottom: 2px solid white;
			padding-bottom: 4px;
		}
		
		#tjan {
			padding-left: 5%;
		}
	</style>

	<body>
		<div class="logink">
			<div class="hzsize" align="center" id="htdl">后台登录</div>
			<form class="layui-form" action="">
				<div class="layui-form-item">
					<div class="hzsize">
						<input type="text" name="title" required lay-verify="required" placeholder="请输入账号" autocomplete="off" class="layui-input" id="zhk">
					</div>
				</div>
				<div class="layui-form-item">
					<div class="hzsize">
						<input type="password" name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input" id="zhk">
					</div>
				</div>
				<div class="layui-form-item">
					<div class="hzsize" id="tjan">
						<button class="layui-btn" lay-submit lay-filter="formDemo">立即登录</button>
						<button type="reset" class="layui-btn layui-btn-primary">重置</button>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">记住账号</label>
					<div class="hzsize">
						<input type="checkbox" name="switch" lay-skin="switch">
					</div>
				</div>
				
			</form>
		</div>

		<script src="base/js/jquery-1.11.3.min.js"></script>
		<script src="file/layui-v2.4.3/layui/layui.js"></script>
		<script type="text/javascript">
			layui.use(['form', 'element', 'carousel'], function() {
				var form = layui.form;
				var element = layui.element;
				var carousel = layui.carousel;
				form.render();
				carousel.render({
					elem: '#test1',
					width: '100%', //设置容器宽度				
					autopaly: true,
					interval: 5000,
					height: '800px',
					arrow: 'hover' //始终显示箭头
					//,anim: 'updown' //切换动画方式
				});
			});
		</script>
	</body>

</html>